<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2018/1/16
  Time: 0:07
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<c:if test="${manager == null }">
    <%response.sendRedirect("../admin/login.jsp");%>
</c:if>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>管理员添加职位</title>
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <link href="../css/layout.css" rel="stylesheet" type="text/css"/>
    <link href="../css/bootstrap.min.css" rel="stylesheet">
    <link href="../css/bootstrap-fileinput.css" rel="stylesheet">
    <link href="../css/addSection.css" rel="stylesheet">
    <link href="../css/registerLogin.css" rel="stylesheet">
    <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="../script/jquery-3.2.1.js"></script>
    <script type="text/javascript" src="../script/commonFunction.js"></script>
    <style type="text/css">
        #name_error {
            margin: -15px auto 10px 110px;
            /*border: solid 1px red;*/
        }

        #add_position_body {
            background-image: url("../images/bg90.jpg");
            background-size: cover;
        }
    </style>
    <script type="text/javascript">
        function checkPosition() {
            var val = $("#newPosition").val();
            var sId = "${section.id}";
            var $ner = $("#name_error");
            var $sub = $("#submit");

            if (val === '') {
                isError($ner, $sub, "请先填写职位再提交！");
                return false;
            }

            $ner.html("检测中...").css("color", "rgba(0,200,188,0.8)");
            $.get("../section/checkPosition",
                {"position": val, "section.id": sId},
                function (data) {
                    if (data === 1) {
                        console.log("data=" + data);
                        isError($ner, $sub, "职位已存在，请重试！")
                        return false;
                    }
                }
            );
            $ner.html("职位可用请提交保存！").css("color", "rgba(0,200,188,0.8)");
            $sub.attr("disabled", false);
            return true;
        }

        $(function () {
            $("#newPosition").blur(function () {
                checkPosition();
            });
        })
    </script>
</head>

<body id="add_position_body">

<div style="width: 70%; margin: 10px auto;">

    <form action="../section/addPosition" method="post" class="form-horizontal form-fmt" role="form" id="myform"
          onsubmit="return checkPosition()">

        <div class="form-group">
            <label for="newPosition" class="col-sm-2 control-label label-width">新职位</label>
            <div class="col-sm-10">
                <input class="form-control" id="newPosition" type="text" name="position" placeholder="请在这里添加新的职位"/>
            </div>
        </div>
        <div class="error" id="name_error"></div>

        <div class="form-group">
            <label for="section_list" class="col-sm-2 control-label label-width">部门</label>
            <div class="col-sm-10">
                <input value="${section.section}" class="form-control" id="section_list" type="text"
                       readonly="true"/>
            </div>
        </div>

        <div class="form-group">
            <label for="position_list" class="col-sm-2 control-label label-width">职位</label>
            <div class="col-sm-10">
                <select class="form-control" id="position_list" readonly="true">
                    <option class="op">已有职位</option>
                    <c:forEach items="${positions}" var="pos">
                        <option value="${pos.id}" class="op">${pos.position}</option>
                    </c:forEach>
                </select>
            </div>
        </div>

        <input type="hidden" name="section.id" value="${section.id}"/>

        <div class="form-group">
            <div class="col-lg-3">
                <button type="submit" class="btn btn-default" id="submit">提交</button>
            </div>
            <div class="col-lg-2">
                <a class="btn btn-default" href="../admin/managePageJump" role="button">取消并返回</a>
            </div>
        </div>

    </form>
</div>

</body>
</html>